<template>
  <div class="edu-page-warp">
    <condition-card @reset="reset" @search="onSubmit">
      <el-row :gutter="24">
        <el-col :span="8">
          <el-form-item :label="$t('teachers.nationality')">
            <el-select v-model="queryForm.country" filterable style="width: 100%;">
              <el-option
                v-for="item in options.nationality"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item :label="$t('label.college')">
            <el-select v-model="queryForm.faculty" filterable style="width: 100%;">
              <el-option
                v-for="item in options.college"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item :label="$t('teachers.title')">
            <el-select v-model="queryForm.title" filterable style="width: 100%;">
              <el-option
                v-for="item in options.professional"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <!--<el-row :gutter="24">
        <el-col :span="8">
          <el-form-item :label="$t('message.status')">
            <el-select v-model="queryForm.approvalStatus" style="width: 100%;">
              <el-option
                v-for="item in options.status"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>-->
    </condition-card>
    <el-card shadow="never">
      <div class="edu-page-title" style="margin-bottom: 24px;">{{$t('teachers.teachersQuery')}}</div>
      <div class="edu-opertion-bar" style="margin-bottom: 16px;">
        <div class="float-left">
          <el-input v-model="queryForm.condition" :placeholder="$t('common.pla.teacherNameCode')" style="width:200px" @keyup.enter.native="onSubmit">
            <i class="el-icon-search" slot="suffix" style="margin-top:10px;cursor:pointer" @click="onSubmit"></i>
          </el-input>
        </div>
        <div class="float-right">
          <el-button type="primary" @click="exportTeacher">{{$t("message.export")}}</el-button>
          <el-button type="primary" @click="openAddDialog">{{$t("message.add")}}</el-button>
        </div>
      </div>
      <el-table stripe :data="teachers" size="mini" width="100%" tooltip-effect="light" @selection-change="chooseTeacher" >
        <edu-table-column type="selection" width="50"></edu-table-column>
        <edu-table-column :label="$t('message.order')" type="index" align="center" width="60"/>
        <edu-table-column prop="code" :label="$t('teachers.code')"/>
        <edu-table-column :label="$t('teachers.teacherName')" prop="name">
          <template slot-scope="props">
            <el-button type="text" @click="openReadDialog(props.row)">{{props.row.name}}</el-button>
          </template>
        </edu-table-column>
        <edu-table-column prop="sexI18n" :label="$t('teachers.gender')"/>
        <edu-table-column :label="$t('teachers.age')">
          <template slot-scope="props">{{formatDate(props.row.age)}}</template>
        </edu-table-column>
        <edu-table-column prop="countryI18n" :label="$t('teachers.nationality')"/>
        <edu-table-column prop="title" :label="$t('teachers.title')"/>
        <edu-table-column prop="facultyI18n" :label="$t('label.college')"/>
        <edu-table-column prop="phone" :label="$t('teachers.phone')"/>
        <edu-table-column prop="email" :label="$t('teachers.email')"/>
        <edu-table-column prop="company" :label="$t('teachers.company')"/>
        <!--<edu-table-column :label="$t('message.status')">
          <template slot-scope="props">
            <el-tag
              v-if="props.row.approvalStatus == 1"
              type="info"
            >{{ $t('message.draft') }}
            </el-tag>
            <el-tag
              v-if="props.row.approvalStatus == 2||props.row.approvalStatus == 3"
            >{{ $t('message.approvaling') }}
            </el-tag>
            <el-tag
              v-if="props.row.approvalStatus == 4"
              type="success"
            >{{ $t('message.pass') }}
            </el-tag>
            <el-tag v-if="props.row.approvalStatus == 0" type="danger">{{ $t('message.reject') }}</el-tag>
          </template>
        </edu-table-column>-->
        <edu-table-column :label="$t('message.operating')" width="120" :showOverflowTooltip="false">
          <template slot-scope="props">
            <div v-if="!props.row.code">
              <!--<el-button type="text" size="mini" @click="submitTeacher(props.row)">{{ $t('message.submit') }}</el-button>-->
              <el-button type="text" size="mini" @click="editTeacher(props.row)">{{$t("message.edit")}}</el-button>
              <el-button type="text" size="mini" @click="deleteTeacher(props.row)">{{$t("message.delete")}}</el-button>
            </div>
          </template>
        </edu-table-column>
      </el-table>
      <el-row>
        <el-col>
          <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
            :current-page="queryForm.pageNum_" :page-sizes="[20,50,100,500,1000]" :page-size="queryForm.pageSize_"
            layout="total, sizes, prev, pager, next, jumper" :total="queryForm.total_" style="float:right;margin-top:10px"></el-pagination>
        </el-col>
      </el-row>
    </el-card>
    <el-dialog
      :title="dialogTitle"
      width="80%"
      class="showDialog"
      :visible.sync="showDialog"
      @close="resetFormValidate()"
      :close-on-click-modal="false"
      v-drag-dialog
    >
      <el-form
        :model="postForm"
        label-position="right"
        label-width="150px"
        :rules="rules"
        ref="postForm"
        label-suffix=":"
      >
        <el-row>
          <el-col :span="8">
            <el-form-item :label="$t('teachers.teacherName')" prop="name">
              <el-input v-model="postForm.name" maxlength="30" :placeholder="$t('common.pla.pleaseInput')"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item :label="$t('teachers.englishName')">
              <el-input v-model="postForm.engName" maxlength="30"
                        :placeholder="$t('common.pla.pleaseInput')"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item :label="$t('teachers.gender')" prop="sex">
              <el-select v-model="postForm.sex" style="width: 100%;">
                <el-option
                  v-for="item in options.sex"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item :label="$t('label.college')" prop="faculty">
              <el-select v-model="postForm.faculty" filterable style="width: 100%;">
                <el-option
                  v-for="item in options.college"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item :label="$t('teachers.nationality')" prop="country">
              <el-select v-model="postForm.country" filterable style="width: 100%;">
                <el-option
                  v-for="item in options.nationality"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item :label="$t('teachers.birthday')" prop="birthday">
              <el-date-picker
                v-model="postForm.birthday"
                type="date"
                style="width:100%"
                :placeholder="$t('teachers.selectDate')"
                value-format="yyyy-MM-dd HH:mm:ss"
              ></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item :label="$t('teachers.title')" prop="title">
              <el-select v-model="postForm.title" filterable style="width: 100%;">
                <el-option
                  v-for="item in options.professional"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item :label="$t('teachers.phone')">
              <el-input v-model="postForm.phone" maxlength="11" :placeholder="$t('common.pla.pleaseInput')"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item :label="$t('teachers.email')">
              <el-input v-model="postForm.email" maxlength="30" :placeholder="$t('common.pla.pleaseInput')"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row v-if="false">
          <el-col :span="8">
            <el-form-item :label="$t('teachers.underTeachQual')" prop="underTeachQual">
              <el-select v-model="postForm.underTeachQual" style="width: 100%;">
                <el-option
                  v-for="item in options.qualifications"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item :label="$t('teachers.postTeachQual')" prop="postTeachQual">
              <el-select v-model="postForm.postTeachQual" style="width: 100%;">
                <el-option
                  v-for="item in options.postQualifications"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item :label="$t('teachers.postTeachQualOnjob')" prop="postTeachQualOnjob">
              <el-select v-model="postForm.postTeachQualOnjob" style="width: 100%;">
                <el-option
                  v-for="item in options.onjobQualifications"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item :label="$t('teachers.company')">
              <el-input v-model="postForm.company" maxlength="30"
                        :placeholder="$t('common.pla.pleaseInput')"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item :label="$t('teachers.startingTimeOfContract')" prop="employBegTime">
              <el-date-picker
                v-model="postForm.employBegTime"
                type="date"
                style="width:100%"
                :placeholder="$t('teachers.selectStartingTimeOfContract')"
                value-format="timestamp"
              ></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item :label="$t('teachers.endingTimeOfContract')" prop="employEndTime">
              <el-date-picker
                v-model="postForm.employEndTime"
                type="date"
                style="width:100%"
                :placeholder="$t('teachers.selectEndingTimeOfContract')"
                value-format="timestamp"
              ></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item :label="$t('teachers.chineseIntroduction')">
              <el-input
                type="textarea"
                rows="4"
                v-model="postForm.introductionCn"
                maxlength="1000"
                :placeholder="$t('teachers.withinThousandWords')"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item :label="$t('teachers.englishIntroduction')">
              <el-input
                type="textarea"
                rows="4"
                v-model="postForm.introductionEn"
                maxlength="1000"
                :placeholder="$t('teachers.withinThousandWords')"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item :label="$t('teachers.uploadCertificateAttachment')">
              <el-upload
                ref="upload"
                :before-upload="beforeAvatarUpload"
                :before-remove="beforeRemove"
                :headers="{'X-Token': $store.state.session.sessionid}"
                :data="{bucketname: 'face', folderpath: 'file'}"
                :on-remove="handleAvatarRemove"
                :on-success="handleAvatarSuccess"
                class="upload-demo"
                action="/api/commonservice/obsfile/uploadFileOutCampusTeacher"
                multiple
                :file-list="fileList"
                :accept="'application/pdf,image/jpeg,image/png,image/jpeg'"
              >
                <el-button size="small" type="primary">{{$t('teachers.clickUpload')}}</el-button>
                <div
                  slot="tip"
                  class="el-upload__tip"
                >{{this.$t("common.upload.uploadPNGJPGJPEGPDFFileOnly")}}{{$t("common.upload.sizeLimit3M")}}
                </div>
              </el-upload>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row></el-row>
        <el-row>
          <el-col :span="24">
            <div class="float-right">
              <el-button @click="cancelApply">{{$t("message.cancel")}}</el-button>
              <el-button type="primary" @click="saveApply">{{$t("message.save")}}</el-button>
            </div>
          </el-col>
        </el-row>
      </el-form>
    </el-dialog>

    <!--   <el-dialog
          title="教师信息"
          width="800px"
          :visible.sync="showReadDialog"
          :close-on-click-modal="false"
      > -->
    <el-dialog
      :visible.sync="showReadDialog"
      :close-on-click-modal="false"
      class="teacher-info"
      width="1000px"
      v-drag-dialog
    >
      <div slot="title">
        <span style="font-size: 18px">{{$t('teachers.teacherInfo')}}</span>
        &nbsp;&nbsp;
        <i class="el-icon-warning" style="color: #C0C4CC"></i>
        <span style="font-size: 12px;color: #C0C4CC">&nbsp;&nbsp;{{$t('teachers.changeMessage')}}</span>
      </div>
      <DetailInfoComponent
        :teacher-info="teacherInfo"
        :outside="true"
      ></DetailInfoComponent>
    </el-dialog>

    <!--    <el-row gutter="20" v-if="readRow" class="row">
           <el-col span="6">教师姓名</el-col>
           <el-col span="6">{{readRow.name}}</el-col>
           <el-col span="6">工号</el-col>
           <el-col span="6">{{readRow.code}}</el-col>
       </el-row>
       <el-row gutter="20" v-if="readRow" class="row">
           <el-col span="6">单位</el-col>
           <el-col span="6">
               <span v-html="readRow.company||'&nbsp;'"></span>
           </el-col>
           <el-col span="6">性别</el-col>
           <el-col span="6">{{readRow.sexI18n}}</el-col>
       </el-row>
       <el-row gutter="20" v-if="readRow" class="row">
           <el-col span="6">合同开始时间</el-col>
           <el-col span="6">{{new Date(readRow.employBegTime).toLocaleDateString()}}</el-col>
           <el-col span="6">合同结束时间</el-col>
           <el-col span="6">{{new Date(readRow.employEndTime).toLocaleDateString()}}</el-col>
       </el-row>
       <el-row gutter="20" v-if="readRow" class="row">
           <el-col span="6">学院</el-col>
           <el-col span="6">
               <span v-html="readRow.facultyI18n||'&nbsp;'"></span>
           </el-col>
           <el-col span="6">国籍</el-col>
           <el-col span="6">{{readRow.countryI18n}}</el-col>
       </el-row>
       <el-row gutter="20" v-if="readRow" class="row">
           <el-col span="6">出生年月</el-col>
           <el-col span="6">{{formatDate(readRow.birthday)}}</el-col>
           <el-col span="6">职称</el-col>
           <el-col span="6">{{readRow.title}}</el-col>
       </el-row>
       <el-row gutter="20" v-if="readRow" class="row">
           <el-col span="6">电话</el-col>
           <el-col span="6">
               <span v-html="readRow.phone||'&nbsp;'"></span>
           </el-col>
           <el-col span="6">邮箱</el-col>
           <el-col span="6">{{readRow.email}}</el-col>
       </el-row>
       <el-row gutter="20" v-if="readRow" class="row">
           <el-col span="6">中文介绍</el-col>
           <el-col span="18">
               <div style="word-break:break-all;">{{readRow.introductionCn}}</div>
           </el-col>
       </el-row>
       <el-row gutter="20" v-if="readRow" class="row">
           <el-col span="6">英文介绍</el-col>
           <el-col span="18">
               <div style="word-break:break-all;">{{readRow.introductionEn}}</div>
           </el-col>
       </el-row> -->
  </div>
</template>
<script>
    import {queryDic} from "common/src/api/dictionary";
    import UTILS from "common/src/utils/utils";
    import {
        addTeacher,
        findTeacherList,
        deleteTeacher,
        updateTeacher,
        updateTeacherStatus,
        findRawTeacherById,
        exportTeacher,
        getReportStatus
    } from "common/src/api/resource/teachers";
    import DetailInfoComponent from "./componet/DetailInfoComponent";

    export default {
        name: "outsideSchoolApply",
        components: {
            DetailInfoComponent
        },
        data() {
            return {
                queryForm: {
                    country: "",
                    faculty: "",
                    title: "",
                    condition: "",
                    approvalStatus: "2",
                    pageNum_: 1,
                    pageSize_: 20,
                    total_: 0,
                    type: 2
                },
                postForm: {
                    name: "",
                    engName: "",
                    sex: "",
                    title: "", //职称
                    email: "",
                    birthday: "",
                    phone: "",
                    faculty: "",
                    country: "",
                    postTeachQual: "",
                    underTeachQual: "",
                    postTeachQualOnjob: "",
                    cerUrl: "",
                    employBegTime: "",
                    employEndTime: "",
                    introductionCn: "",
                    introductionEn: ""
                },
                options: {
                    nationality: [],
                    college: [],
                    professional: [],
                    status: [],
                    sex: [],
                    qualifications: [], //是否有本科生授课资格
                    postQualifications: [], //是否研究生授课资格
                    onjobQualifications: [] //是否在职研究生授课资格
                },
                rules: {
                    name: [
                        {
                            required: true,
                            message: this.$t('teachers.writeNamePlease'),
                            trigger: "blur"
                        },
                        {
                            validator: this.notBlank,
                            trigger: "blur"
                        }
                    ],
                    sex: [
                        {
                            required: true,
                            message: this.$t('teachers.selectGenderPlease'),
                            trigger: "blur"
                        }
                    ],
                    underTeachQual: [
                        {
                            required: true,
                            message: this.$t('teachers.isUnderTeachQual'),
                            trigger: "blur"
                        }
                    ],
                    postTeachQual: [
                        {
                            required: true,
                            message: this.$t('teachers.isPostTeachQual'),
                            trigger: "blur"
                        }
                    ],
                    postTeachQualOnjob: [
                        {
                            required: true,
                            message: this.$t('teachers.isPostTeachQual'),
                            trigger: "blur"
                        }
                    ],
                    employBegTime: [
                        {
                            required: true,
                            message: this.$t('teachers.selectStartTime'),
                            trigger: "blur"
                        }
                    ],
                    employEndTime: [
                        {
                            required: true,
                            message: this.$t('teachers.selectEndTime'),
                            trigger: "blur"
                        },
                        {
                            validator: this.compareDate,
                            trigger: "blur"
                        }
                    ],
                    title: [
                        {
                            required: true,
                            message: this.$t('teachers.selectTitle'),
                            trigger: "blur"
                        }
                    ],
                    faculty: [
                        {
                            required: true,
                            message: this.$t('teachers.selectCollege'),
                            trigger: "blur"
                        }
                    ],
                    country: [
                        {
                            required: true,
                            message: this.$t('teachers.selectNationality'),
                            trigger: "blur"
                        }
                    ],
                    birthday: [
                        {
                            required: true,
                            message: this.$t('teachers.selectBirthday'),
                            trigger: "blur"
                        }
                    ]
                },
                dialogTitle: "",
                showDialog: false,
                showReadDialog: false,
                teachers: [],
                uploadFiles: [],
                //readRow: null,
                teacherInfo: null,
                fileList: [],
                chooseTeachers: [],
            };
        },
        mounted: function () {
            this.init();
        },
        methods: {
            init() {
                let yes = {label: this.$t("message.yes"), value: "1"};
                let no = {label: this.$t("message.no"), value: "0"};
                this.options.qualifications.push(yes);
                this.options.qualifications.push(no);
                this.options.postQualifications.push(yes);
                this.options.postQualifications.push(no);
                this.options.onjobQualifications.push(yes);
                this.options.onjobQualifications.push(no);
                this.options.status.push({
                    label: this.$t("message.draft"),
                    value: 1
                });
                this.options.status.push({
                    label: this.$t("message.approvaling"),
                    value: 2
                });
                this.options.status.push({
                    label: this.$t("message.pass"),
                    value: 4
                });
                this.options.status.push({label: this.$t("message.reject"), value: 0});
                //筛选条件字典查询
                let data = {
                    lang: this.$store.getters.language || "cn",
                    type: "allChild",
                    keys: ["X_YX", "profession", "G_GJQU", "G_XBIE"]
                };
                queryDic(data).then(res => {
                    if (res.code == 200) {
                        UTILS.fillSelect(
                            {
                                nationality: "G_GJQU",
                                college: "X_YX",
                                professional: "profession",
                                sex: "G_XBIE"
                            },
                            res.data,
                            this.options
                        );
                    }
                });
                this.onSubmit();
            },
            onSubmit() {
                this.getDataList();
            },
            reset() {
                this.queryForm.condition = "";
                this.queryForm.country = "";
                this.queryForm.faculty = "";
                this.queryForm.title = "";
                this.queryForm.approvalStatus = "2";
                this.onSubmit();
            },
            getDataList(isFirstPage = true) {
                if (isFirstPage) {
                    this.queryForm.pageNum_ = 1;
                }
                findTeacherList(this.queryForm).then(res => {
                    if (res.code == 200) {
                        this.teachers = res.data.list;
                        this.queryForm.total_ = res.data.total_;
                    }
                });
            },
            handleSizeChange(val) {
                this.queryForm.pageSize_ = val;
                this.getDataList();
            },
            handleCurrentChange(val) {
                this.queryForm.pageNum_ = val;
                this.getDataList(false);
            },
            openAddDialog() {
                this.dialogTitle = this.$t('teachers.addApprove');
                if (this.$refs.upload) {
                    this.$refs.upload.clearFiles();
                }
                this.showDialog = true;
                this.postForm.underTeachQual = "0";
                this.teachers.postTeachQual = "0";
                this.postForm.postTeachQualOnjob = "0";
            },
            resetFormValidate() {
                this.$refs.postForm.clearValidate();
                Object.keys(this.postForm).forEach(k => {
                    this.postForm[k] = "";
                });
                this.editId = "";
                this.fileList.length = 0;
            },
            saveApply() {
                this.$refs.postForm.validate(valid => {
                    if (!valid) {
                        return;
                    }
                    let fn = res => {
                        if (res.code == 200) {
                            this.$message({
                                type: "success",
                                message: this.$t("message.saveSuccess")
                            });
                            this.onSubmit();
                            this.showDialog = false;
                        }
                    };
                    this.postForm.cerUrl =
                        this.fileList.length == 0
                            ? ""
                            : this.fileList.map(f => f.url).join(",");

                    if (this.editId) {
                        let data = _.cloneDeep(this.postForm);
                        data.id = this.editId;
                        updateTeacher(data).then(fn);
                    } else {
                        addTeacher(this.postForm).then(fn);
                    }
                });
            },
            cancelApply() {
                this.showDialog = false;
            },
            handleAvatarRemove(file, fileList) {
                this.fileList = this.fileList.filter(f => f.url != file.url);
            },
            handleAvatarSuccess(res, file) {
                if (res.code == 200) {
                    this.$message({
                        type: "success",
                        message: this.$t("common.tips.uploadSuccess")
                    });


                    let obj = res.data[file.name];

                    this.fileList.push({name: obj.fileName, url: obj.objectkey});
                } else {
                    this.$message({
                        type: "error",
                        message: res.msg
                    });
                    this.clearFiles();
                }

            },
            clearFiles() {
                this.$refs.upload.clearFiles();
                this.fileList = [];
            },
            submitTeacher(row) {

                this.$eduAlert(this.$t("teachers.confirmSubmitOutsideTeacher"), this.$t("message.prompt")).then(() => {
                    let data = {approvalStatus: 2, ids: [row.id]};
                    updateTeacherStatus(data).then(res => {
                        if (res.code == 200) {
                            this.$message({
                                type: "success",
                                message: this.$t("minor.tip.submitSuccess")
                            });
                            this.getDataList();
                        }
                    });
                });
                // this.$confirm(
                //     this.$t("teachers.confirmSubmitOutsideTeacher"),
                //     this.$t("message.prompt"),
                //     {
                //         confirmButtonText: this.$t("message.confirm"),
                //         cancelButtonText: this.$t("message.cancel"),
                //         type: "warning"
                //     }
                // ).then(() => {
                //     let data = { approvalStatus: 2, ids: [row.id] };
                //     updateTeacherStatus(data).then(res => {
                //         if (res.code == 200) {
                //             this.$message({
                //                 type: "success",
                //                 message: this.$t("minor.tip.submitSuccess")
                //             });
                //             this.getDataList();
                //         }
                //     });
                // });
            },
            editTeacher(row) {
                this.editId = row.id;
                findRawTeacherById(this.editId).then(res => {
                    if (res.code == 200) {
                        if (this.$refs.upload) {
                            this.$refs.upload.clearFiles();
                        }
                        this.dialogTitle = this.$t('teachers.editApprove');
                        this.showDialog = true;
                        Object.keys(res.data).forEach(k => {
                            if (this.postForm.hasOwnProperty(k)) {
                                this.postForm[k] = res.data[k];
                            }
                        });
                        if (res.data.cerUrl) {
                            res.data.cerUrl.split(",").forEach((path, index) => {
                                this.fileList.push({
                                    name: this.$t('teachers.attachment') + (index + 1),
                                    url: path
                                });
                            });
                        }
                    }
                });
            },
            deleteTeacher(row) {
                // this.$confirm(
                //     this.$t("message.deleteConfirm"),
                //     this.$t("message.prompt"),
                //     {
                //         confirmButtonText: this.$t("message.confirm"),
                //         cancelButtonText: this.$t("message.cancel"),
                //         type: "warning"
                //     }
                // ).then(() => {
                this.$delConfirm().then(() => {
                    deleteTeacher({ids: [row.id]}).then(res => {
                        if (res.code == 200) {
                            this.$message({
                                type: "success",
                                message: this.$t("message.deleteSuccess")
                            });
                            this.getDataList();
                        }
                    });
                });
            },
            openReadDialog(row) {
                this.showReadDialog = true;
                this.teacherInfo = row;
                // this.readRow = row;
            },
            formatDate(date) {
                return date ? date.split(" ")[0] : "";
            },
            exportTeacher() {
                let loading = this.$loading({
                    lock: true,
                    text: "Loading",
                    spinner: "el-icon-loading",
                    background: "rgba(255, 255, 255, .48)"
                });
                let data = _.cloneDeep(this.queryForm);
                data.ids = this.chooseTeachers.map(c => c.id);
                exportTeacher(data).then(res => {
                    if (res.code == 200) {
                        this.delayRequest(res.data.key, loading);
                    } else {
                        loading.close();
                    }
                });
            },
            //异步获取批量结果
            async delayRequest(key, loading) {
                await new Promise(resolve => setTimeout(resolve, 5000));
                getReportStatus(key)
                    .then(res => {
                        if (res.code == 200 && res.data.status) {
                            loading.close();
                            let path =
                                "/api/baseresservice/teacher/export?path=" +
                                res.data.path;
                            window.location.href = path
                            //window.open(path);
                        } else {
                            this.delayRequest(key, loading);
                        }
                    })
                    .catch(ex => {
                        this.delayRequest(key, loading);
                    });
            },
            notBlank(rule, value, callback) {
                if (value && value.toString().replace(/^\s+|\s+$/g, "") == "") {
                    callback(new Error(this.$t('teachers.InvalidSpaces')));
                } else {
                    callback();
                }
            },
            compareDate(rule, value, callback) {
                if (this.postForm.employBegTime && this.postForm.employEndTime) {
                    if (this.postForm.employBegTime > this.postForm.employEndTime) {
                        callback(new Error(this.$t('teachers.endTimeGreaterThanStartTime')));
                    } else {
                        callback();
                    }
                } else {
                    callback();
                }
            },
            beforeRemove(file, fileList) {
                return this.$confirm(this.$t("common.upload.remove") + ` ${file.name}？`);
            },
            beforeAvatarUpload(file) {
                let extName = file.name.substring(file.name.indexOf(".") + 1).toLowerCase().trim();
                if (!(extName === 'pdf' || extName === 'jpg' || extName === 'png' || extName === 'jpeg')) {
                    this.$message({
                        type: "error",
                        message: this.$t("common.upload.unSupportesFileType")
                    });
                    this.$refs.upload.clearFiles();
                    return;
                }
                if (!(file.size / 1024 / 1024 < 3)) {
                    this.$message({
                        type: "error",
                        message: this.$t("common.upload.sizeLimit3M")
                    });
                    this.$refs.upload.clearFiles();
                    return;
                }
            },
            chooseTeacher(val) {
                this.chooseTeachers = val;
            },
        }
    };
</script>
<style lang="scss" scoped>
  .row {
    margin: 15px 0 0 0;
  }
</style>
